<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/statics/common/vendor/jquery-easyui-1.5.1/themes/color.css">
<div class="container">
	<div id="userGrid"></div>
	<div id="userToolbar">
		<div>
			<a href="#" class="easyui-linkbutton" onclick="user.toolbar.showAddDialog();" data-options="
			iconCls:'icon-add'">
				新增(ALT+A)
			</a>
			<a href="#" class="easyui-linkbutton" onclick="user.toolbar.showUpdateDialog();" data-options="
			iconCls:'icon-edit'">
				修改(ALT+C)
			</a>
			<a href="#" class="easyui-linkbutton" onclick="user.toolbar.remove();" data-options="
			iconCls:'icon-remove'">
				删除
			</a>
			
			<a href="#" class="easyui-linkbutton" onclick="user.toolbar.redo();" data-options="
			iconCls:'icon-redo'">
				取消(ALT+Z)
			</a>
		</div>
		<div>
			<strong>姓名：</strong>
			<input type="text" name="name" id="searchName" class="easyui-textbox"/>
			
			<strong>角色：</strong>
			<select name="roleGroup" id="roleGroup">
			</select>
			
			<strong>状态：</strong>
			<select name="stateGroup" id="stateGroup" class="easyui-combobox" data-options="width: 70, panelHeight: 'auto'" >
				<option value="1">启用</option>
				<option value="2">禁用</option>
				<option value="-1">所有</option>
			</select>
			
			<a href="#" class="easyui-linkbutton" onclick="user.toolbar.searchUser()" data-options="
			iconCls:'icon-search'">
				查询(ALT+S)
			</a>
		</div>
	</div>
	
	<div id="userAddDialog" class="easyui-dialog" style="width:350px; padding:30px 30px;" data-options="
	title:'新增用户',
	modal: true,
	buttons:'#userAddButtons',
	closed: true,
	panelHeight: 'auto',
	onClose:user.toolbar.resetAddFrom">
		<form id="userAddForm" method="post">
			<!-- 简单的非空验证 -->
			<div style="margin-bottom:10px">
				<span class="mytitle">帐号：</span>
				<input id="code" name="code" style="width:90%" class="easyui-textbox" data-options="
				required: true,
				validType: 'maxLength[20]'">
			</div>
			<div style="margin-bottom:10px">
				<span class="mytitle">姓名：</span>
				<input id="name" name="name" placeholder="输入姓名" style="width:90%" class="easyui-textbox" data-options="
				required: true,
				validType: 'maxLength[20]'">
			</div>
			
			<div style="margin-bottom:10px">
				<span class="mytitle">角色：</span>
				<select name="roleId" style="width:90%" class="easyui-combobox" data-options="
				required: true,
				valueField:'id',
	            textField:'name',
				width: 100,			
				panelHeight: 'auto',
				url: '<%=request.getContextPath()%>/sys/role/listUserRoleCombobox/spec',
				onLoadSuccess: function () { 
					var data = $('#roleGroup').combobox('getData');
				    if (data.length > 0) {
				    	$('#roleGroup').combobox('select', data[0].name);
				    } 
				}">
				</select>
			</div>
			
			<div style="margin-bottom:10px">
				<span class="mytitle">状态：</span>
				<select name="state" style="width:90%" class="easyui-combobox" data-options="
				panelHeight: 'auto',
				editable: false">
					<option value="1">启用</option>
					<option value="2">禁用</option>
				</select>
			</div>
			
		</form>
	</div>
	<div id="userAddButtons">
		<a href="#" onclick="user.toolbar.add()" class="easyui-linkbutton" data-options="
		iconCls: 'icon-add',
		plain: true">
			新增
		</a>
		<a href="#" onclick="user.toolbar.hiddenAddDialog();" class="easyui-linkbutton" data-options="
		iconCls: 'icon-redo',
		plain: true">
			取消
		</a>
	</div>
	
	
	<div id="userUpdateDialog" class="easyui-dialog" data-options="
	title: '修改用户',
	buttons: '#userUpdateButtons',
	modal: true,
	closed: true,
	width: 300,
	onClose: user.toolbar.resetUpdateFrom">
		<form id="userUpdateForm" method="post" style="padding: 20px">
			<input type="hidden" name="id"/>
			<!-- 简单的非空验证 -->
			<div style="margin-bottom:10px">
				<span class="mytitle">帐号：</span>
				<input id="newCode" name="code" style="width:90%" class="easyui-textbox" data-options="
				required: true">
			</div>
			<div style="margin-bottom:10px">
				<span class="mytitle">姓名：</span>
				<input id="name" name="name" style="width:90%" class="easyui-textbox" data-options="
				required: true">
			</div>
			
			
			<div style="margin-bottom:10px">
				<span class="mytitle">角色：</span>
				<select name="roleId" style="width:90%" class="easyui-combobox" data-options="
				required: true,
				valueField:'id',
	            textField:'name',
				width: 100,			
				panelHeight: 'auto',
				url: '<%=request.getContextPath()%>/sys/role/listUserRoleCombobox/spec',
				onLoadSuccess: function () { 
					var data = $('#roleGroup').combobox('getData');
				    if (data.length > 0) {
				    	$('#roleGroup').combobox('select', data[0].name);
				    } 
				}">
				</select>
			</div>
			
			<div style="margin-bottom:10px">
				<span class="mytitle">状态：</span>
				<select name="state" style="width:90%" class="easyui-combobox" data-options="
				panelHeight: 'auto',
				editable: false">
					<option value="1">启用</option>
					<option value="2">禁用</option>
				</select>
			</div>
			
		</form>
	</div>
	<div id="userUpdateButtons">
		<a href="#" onclick="user.toolbar.update()" class="easyui-linkbutton" data-options="
		iconCls: 'icon-edit',
		plain: true">
			修改
		</a>
		<a href="#" onclick="user.toolbar.hiddenUpdateDialog();" class="easyui-linkbutton" data-options="
		iconCls: 'icon-redo',
		plain: true">
			取消
		</a>
	</div>
</div>
<script src="<%=request.getContextPath()%>/statics/sys/scripts/user/user-manager.js"></script>
<script src="<%=request.getContextPath()%>/statics/sys/scripts/user/user-valid.js"></script>
